<%-- 
    Document   : adminReportDetail
    Created on : Oct 17, 2013, 9:36:59 PM
    Author     : h10t93
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

        <script>
            $(function() {
                $( "#datepicker").datepicker();
            });
        </script>  
    </head>
    <body>

        <h1>Report detail</h1>
        <form name="frm" method="POST">

            <div style="border: solid 1px #D6D6D6; float: left; height: 100px; width:300px; margin-bottom:10px  ">
                <span>Select by day: </span><input type="text" id="datepicker" name="txtdate" />
                <button type="submit" onclick="frm.action='ManageServlet?action=reportDetailByDate'">View</button>
            </div>
            <div style="border: solid 1px #D6D6D6; float: left; height: 100px; width:300px; margin-bottom:10px  ">
                <span> select by morth:</span>
                <br/><span>Morth:</span>
                <select name="txtMorth" style="width:100px">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                    <option>5</option>
                    <option>6</option>
                    <option>7</option>
                    <option>8</option>
                    <option>9</option>
                    <option>10</option>
                    <option>11</option>
                    <option>12</option>
                </select>
                <br/> <span>year:</span>
                <input type="text" name="txtYear"/>
                <input type="submit" value="view" onclick="frm.action='ManageServlet?action=reportPendingCompByMorth'"/>
                <c:set var="total" scope="session" value="${sessionScope['totalCompPendingByMorth']}"/>
              
            </div>
            <div style="border: solid 1px #D6D6D6; float: left; height: 100px; width:300px; margin-bottom:10px  ">
                <span> select by year:</span>
                <input/>
                <button type="subimt" onclick="frm.action='ManageServlet?action=reportDetail'">Search</button>
            </div>
            <button type="subimt" onclick="frm.action='ManageServlet?action=reportDetail'">Load All</button>
            <div style="margin-top: 10px;  clear:both;">
                <table border="1">
                    <tr>
                        <th style="width: 150px">Complaint ID</th>
                        <th style="width: 100px">User ID</th>
                        <th style="width: 200px">User Name</th>
                        <th style="width: 200px">Category</th>
                        <th style="width: 200px">Departments User</th>
                        <th style="width: 200px">Name Technician</th>
                        <th style="width: 100px">Date Lodging<th>
                        <th style="width: 100px">Date Closing</th>

                    </tr>            
                    <c:forEach var="p" items="${sessionScope['sReport']}">
                        <tr>
                            <td style="width: 150px">${p.idComplaint}</td>
                            <td style="width: 100px">${p.idUser}</td>
                            <td style="width: 200px">${p.nameUser}</td>
                            <td style="width: 200px">${p.compCategory}</td>
                            <td style="width: 200px">${p.departmentUser}</td>
                            <td style="width: 200px">${p.nameTechnician}</td>
                            <td style="width: 100px"> ${p.dateLodging}</td>
                            <td style="width: 100px">${p.dateClose}</td>

                        </tr>
                    </c:forEach>
                </table>
            </div>            

        </form>
    </body>
</html>
